<template>
    <div  id="mainContent" class="content">
        <div class="el-card noPrint is-always-shadow">
            <div class="el-card__header">R131V5小区信息模糊查询</div>
            <div class="el-card__body">
                <form class="el-form demo-ruleForm el-form--label-top el-form--inline">
                    <div class="el-row is-align-bottom el-row--flex" style="margin-left: -20px;width:100%; margin-right: -20px;">
                        <div class="el-col el-col-10 el-col-xs-24 el-col-md-10 el-col-lg-10" style="padding-left: 20px; padding-right: 20px;">
                            <div class="el-form-item is-required">
                                <label for="idNo" class="el-form-item__label">城市国标</label>
                                <el-input v-model="city" placeholder="城市国际" />
                            </div>
                        </div> 
                        <div class="el-col el-col-10 el-col-xs-24 el-col-md-10 el-col-lg-10" style="padding-left: 20px; padding-right: 20px;">
                            <div class="el-form-item is-required">
                                <label for="idNo" class="el-form-item__label">地址/别名/名称</label>
                                <el-input v-model="address" placeholder="地址/别名/名称" />     
                            </div>
                        </div> 
                    </div>
                    <div class="el-row is-align-bottom el-row--flex" style="margin-left: -20px;width:100%; margin-right: -20px;">
                        <div class="el-col el-col-10 el-col-xs-24 el-col-md-10 el-col-lg-10" style="padding-left: 20px; padding-right: 20px;">
                            <div class="el-form-item is-required">
                                <label for="idNo" class="el-form-item__label">物业类型</label>
                                <el-select v-model="HouseType" placeholder="住宅">
                                    <el-option
                                        v-for="item in options"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value"
                                    />
                                </el-select>
                            </div>
                        </div> 
                        <div class="el-col el-col-10 el-col-xs-24 el-col-md-10 el-col-lg-10" style="padding-left: 20px; padding-right: 20px;">
                            <div class="el-form-item text-right"><!---->
                                <div class="el-form-item__content">
                                    <button type="button" class="el-button el-button--primary el-button--small is-round"><!----><!---->
                                        <span>执行查询</span>
                                    </button> <!----> <!----><!---->
                                </div>
                            </div>
                        </div> 
                    </div>
                </form>
            </div>
        </div> 
        <div class="el-card is-always-shadow">
            <div class="el-card__header">
                <div class="clearfix"><!----> 
                    <span>查询样例</span> 
                    <div style="display: inline-block; float: right;">
                        <button type="button" class="el-button noPrint el-button--danger el-button--mini is-round" style="padding: 6px 10px; margin-right: 8px;"><!----><!---->
                            <span>打印结果</span>
                        </button>
                    </div>
                </div>
            </div>
            <div class="el-card__body"> <!----> 
                <table class="table card-text text-left">
                    <tr>
                        <td>小区ID</td> 
                        <td>城市代码</td>
                        <td>区域</td>
                        <td>小区名称</td>
                        <td>数据类型</td>
                        <td>建筑类型</td>
                        <td>小区地址</td>
                        <td>所属街区</td>
                        <td>建造时间</td>
                        <td>开盘时间</td>
                        <td>物业类型</td>
                    </tr> 
                    <tr>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                    </tr> 
                    <tr>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                    </tr>
                    <tr>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                    </tr> 
                    <tr>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                        <td>XD,QK</td>
                        <td>案件类型</td> 
                    </tr>
                </table>
            </div>
        </div>
    </div>
</template>
<script setup >
import { ref } from 'vue'
const HouseType = ref('')
const address = ref('')
const city = ref('')
const options = [
  {
    value: '1',
    label: '住宅',
  },
  {
    value: '2',
    label: '办公',
  },
  {
    value: '3',
    label: '商铺',
  }
]
</script>
